import 'package:flutter/material.dart';
import 'package:flutter_screenutil/screenutil.dart';
import 'package:jspang/provide/details_info.dart';
import 'package:provider/provider.dart';

class DetailsTopArea extends StatelessWidget {
  const DetailsTopArea({Key key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Selector<DetailsInfoProvide, DetailsInfoProvide>(
      selector: (context, provider) => provider,
      shouldRebuild: (pre, next) => true,
      builder: (context, value, child) {
        var goodsInfo = Provider.of<DetailsInfoProvide>(context, listen: false)
            .goodsInfo
            .data
            .goodInfo;
        if (goodsInfo != null) {
          return Container(
            color: Colors.white,
            child: Column(
              children: <Widget>[
                _goodsImage(goodsInfo.image1),
                _goodsName(goodsInfo.goodsName),
                _goodsNum(goodsInfo.goodsSerialNumber),
                _goodsprice(goodsInfo.presentPrice,goodsInfo.oriPrice)
              ],
            ),
          );
        } else {
          return Text('正在加载中……');
        }
      },
    );
  }

  //头部图片
  Widget _goodsImage(url) {
    return Image.network(
      url,
      width: ScreenUtil().setWidth(740),
    );
  }

  //商品名称
  Widget _goodsName(name) {
    return Container(
      width: ScreenUtil().setWidth(740),
      padding: EdgeInsets.only(left: 15.0),
      child: Text(name, style: TextStyle(fontSize: ScreenUtil().setSp(38))),
    );
  }

  //商品编号
  Widget _goodsNum(num) {
    return Container(
      child: Text(
        '编号:$num',
        style: TextStyle(color: Colors.black12),
      ),
      width: ScreenUtil().setWidth(740),
      padding: EdgeInsets.only(left: 15.0),
    );
  }

  //商品价格
  Widget _goodsprice(price,oriPrice) {
    return Container(
      child: Row(
        children: <Widget>[
          Text(
            '￥$price',
            style: TextStyle(color: Colors.red,fontSize: ScreenUtil().setSp(38)),
          ),
          SizedBox(width: ScreenUtil().setWidth(50),),
          Text('市场价:'),
          SizedBox(width: ScreenUtil().setWidth(50),),
           Text(
            '￥$oriPrice',
            style: TextStyle(color: Colors.black12,decoration: TextDecoration.lineThrough),
          ),
        ],
      ),
      width: ScreenUtil().setWidth(740),
      padding: EdgeInsets.only(left: 15.0,top: 10.0,bottom: 10.0),
    );
  }
}
